<script lang="ts">
import NameCategory from "@/components/slot/name/NameCategory.vue";

export default {
  name: 'UserDemo',
  components: {
    NameCategory
  },
  data() {
    return {
      foods: ["苹果", "麻辣烫", "水煮肉片"],
      music: ["美人鱼", "醉赤壁", "三国杀"],
      games: ["英雄联盟", "Counter-Strike", "Dota2"]
    }
  }
}
</script>

<template>
  <div>

    <NameCategory title="音乐">
      <ul slot="slot1">
        <li v-for="(item,index) in music" :key="index"> {{ item }}</li>
      </ul>
      <template slot="slot2">
        <img src="https://img9.doubanio.com/view/photo/s_ratio_poster/public/p2920749956.jpg" alt="图片">
      </template>
    </NameCategory>
    <NameCategory title="游戏">
      <video src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4"></video>
    </NameCategory>
  </div>
</template>

<style scoped>

</style>
